<template>
    <Menu mode="horizontal" :theme="theme1" active-name="recommendate">
        <MenuItem  v-for="menu, key in menus" :key="'menu'+key" :name="menu.to" :to="menu.to">
            <Icon :type="menu.icon" />
                {{menu.name}}
        </MenuItem>
        <Submenu v-for="menu, key in menusChild" :key="key"  name="menu.title">
            <template slot="title">
                <Icon :type="menu.icon" />
                    {{menu.name}}
            </template>
            <MenuItem v-for="item, key in menu.child" :key="key" :name="item.to" :to="item.to">{{item.name}}</MenuItem>
            
        </Submenu>
    </Menu>
   
</template>
<script>
    export default {
        name:'menuBox',
        data () {
            return {
                theme1: 'dark',
                menus:[
                    {
                        name:'基金',
                        to:'fund',
                        icon:'ios-stats',
                        child:[]
                    },
                    {
                        name:'组合',
                        to:'combo',
                        icon:'ios-speedometer',
                        child:[]
                    },
                    {
                        name:'回测',
                        to:'backtest',
                        icon:'ios-pulse',
                        child:[]
                    },
                    {
                        name:'智能推荐',
                        to:'recommendate',
                        icon:'ios-locate',
                        child:[]
                    }
                    
                ],
                menusChild:[
                    {
                        name:'我的',
                        title:'my',
                        to:'',
                        icon:'ios-star',
                        child:[
                            {
                                name:'我的关注',
                                to:'myFavorate',
                                icon:'ios-locate',
                            },
                             {
                                name:'我的组合',
                                to:'myCombo',
                                icon:'ios-locate',
                            },
                        ]
                    },
                ]
            }
        }
    }
</script>
<style scoped>

</style>